
Vue.component2('a_1_0_0_3_1', {  
    template: `
        <div class="a_1_0_0_3_1_dir"ref="div" v-if="show_flag":key="refresh" :style="lefttop"
        >
        <div class="a_1_0_0_3_1_title">
            <span  class="a_1_0_0_3_1_left icon iconfont icon-yidong"
        @mousedown="mouse_down1"
            ></span>
            <span class="a_1_0_0_3_1_center">浮动属性编辑框</span>
            <span :class="{
            'a_1_0_0_3_1_right':data.true,
            
            'icon iconfont icon-fangda':!slot_flag,'icon iconfont icon-suoxiao':slot_flag,}"@click="slot_show"></span>
        </div>

        <div v-show="slot_flag">
            <slot></slot>
        </div>
            
        </div>
`,  
  data() {
      return {
        show_flag:true,
        lefttop:"right:15px;",
        now_select:"-1",
        refresh:"1",/*用来刷新组件*/
        slot_flag:true,
        data:{
        true:true,
        height:'35px',
            //目录结构:
            /*
           menus: {
                'menu_id':{//目录id
                    "menu_name":"目录名称",
                    "menu_fast":"快捷键",
                    "item_fast":[],//快速搜索目录
                    "item_dct":{//目录中的选项
                        "item_id":{//选项id
                        "item_fast":"快捷键",
                            "item_name":"选项名称",
                            "callback":"选项回调函数"
                        }

                    }
                }
            },
            */
            menus: {

        },
        fast_menu:[],//存放menus ids的数组 ids被转为整数 按照sort顺序排列
        show_flag:{}
        }
         
      };
  },
  methods:{

    slot_show:function(){
        this.slot_flag=this.slot_flag==true?false:true;
    },
    绘制移动:function(event){
        let data=this.data.全局鼠标操作对象1.get_data({key:"移动浮动属性编辑框"});
        this.lefttop=`left:${data.x+(event.clientX-data.startx)};top:${data.y+(event.clientY-data.starty)};`
    },
    停止移动:function(event){
        this.data.全局鼠标操作对象1.unset_move({
            key:"移动浮动属性编辑框",
            key2:"移动浮动属性编辑框move",});
            this.data.全局鼠标操作对象1.unset_up({
                key:"移动浮动属性编辑框",
                key2:"移动浮动属性编辑框up",});
    },
    mouse_down1:function(event){
        let dom=this.$refs.div;
        let rect=dom.getBoundingClientRect();
        let x=rect.left;
        let y=rect.top;
        this.data.全局鼠标操作对象1.set_data({
            key:"移动浮动属性编辑框",
            data:{x:x,y:y,
                startx:event.clientX,
                starty:event.clientY
            }
        });
  
  
          this.data.全局鼠标操作对象1.set_move({
            key:"移动浮动属性编辑框",
            key2:"移动浮动属性编辑框move",
            func:this.绘制移动,
        });
        this.data.全局鼠标操作对象1.set_up({
            key:"移动浮动属性编辑框",
            key2:"移动浮动属性编辑框up",
            func:this.停止移动,
        });
  
          event.stopPropagation();
      },
  },
  mounted:function(){
       
  }
} 
);

